<template>
  <el-dialog
    class="detail-dialog"
    :class="{ audit: editType === 2 }"
    :title="title"
    width="1100px"
    :close-on-click-modal="false"
    :visible.sync="dialog.visible"
    v-if="dialog.visible"
  >
    <el-tabs v-model="activeName" @tab-click="handleClick" class="tab">
      <el-tab-pane
        v-for="(item, index) of tabArr"
        :label="item.label"
        :name="item.vlaue"
        :key="'title' + index"
      ></el-tab-pane>
    </el-tabs>

    <div class="type2" :class="{ audit: editType === 2 }">
      <div class="row">
        <!-- <devformVue label="ww" type="unfull"> 123 </devformVue>
        <devformVue label="ww" type="unfull"> 123 </devformVue> -->
      </div>
      <template v-if="activeName == 1">
        <div class="type2-title margin-t0">结案信息</div>
        <div class="row">
          <devformVue label="结案方式 ">
            <dict-tag
              :options="dict.type.resolve_type"
              :value="formline.resolveType"
            />
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="案件名称 " classname="w2">
            {{ formline.caseName }}
          </devformVue>
          <devformVue label="案件编号 " classname="w2">
            {{ formline.caseNo }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="收案时间" classname="w2">
            {{ formline.receiptDate }}
          </devformVue>
          <devformVue label="案件类型" classname="w2">
            {{ formline.categoryName }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="客户"> {{ formline.customerName }}</devformVue>
        </div>
        <!-- <div class="row">
          <devformVue label="委托人"> {{ clientParties }} </devformVue>
        </div> -->
        <div class="row" v-if="formline.categoryId == 'sys_carage_type_2'">
          <devformVue label="被告人（犯罪嫌疑人）" classname="w2">
            {{ formline.defendant }}
          </devformVue>
          <devformVue label="委托人与当事人关系" classname="w2">
            {{ formline.mandatorRelationship }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="对方当事人">
            {{ targetPartiesshow }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue
            label="受理机构"
            v-if="
              ![
                'sys_carage_type_4',
                'sys_carage_type_6',
                'sys_carage_type_11',
              ].includes(formline.categoryId)
            "
          >
            {{ formline.suitInfo.acceptOrgName }}
            <!-- <dict-tag
              :options="dict.type.sys_accept_org_name"
              :value="formline.suitInfo.acceptOrgId"
            /> -->
          </devformVue>
          <!-- <devformVue
            label="代理程序"
            classname="w2"
            v-if="
              ![
                'sys_carage_type_4',
                'sys_carage_type_6',
                'sys_carage_type_11',
              ].includes(formline.categoryId)
            "
          >
            <dict-tag
              style="margin-right: 13px"
              v-for="item in proxyProcedureshow"
              :key="item + 'proxyProcedure'"
              :options="dict.type[proxyProcedurearry]"
              :value="item"
            />
          </devformVue> -->
        </div>
        <div class="row">
          <devformVue label="案件负责人" classname="w2">
            {{ formline.settleInfo.sourcePerson }}
          </devformVue>
          <devformVue label="承办人员" classname="w2">
            {{ formline.settleInfo.handlerName }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="合同金额(元)" classname="w2">
            {{ formline.financialInfo.contractAmount }}
          </devformVue>
          <devformVue label="收费方式" classname="w2">
            <dict-tag
              :options="dict.type.payment_type"
              :value="formline.financialInfo.paymentType"
            />
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="已收金额(元)" classname="w2">
            {{ formline.financialInfo.totalAmount }}
          </devformVue>
          <devformVue label="尚欠费(元)" classname="w2">
            {{ formline.settleInfo.unRecAmount }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="结案时间">
            {{ formline.resolveDate | changeTime }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="销案原因">
            {{ formline.resolveRemark }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="附件">
            <el-table
              :data="formline.contractInfo.attachments"
              style="width: 100%"
              border
              class="primary-table"
            >

              <el-table-column
                prop="filename"
                label="文件"
                align="center"
                width="180"
              >
                <template slot-scope="scope">
                  <el-button type="text" @click="ondownload(scope.row)"
                    >{{ scope.row.filename }}
                  </el-button>
                </template>
              </el-table-column>
              <el-table-column
                prop="size"
                label="大小"
                align="center"
                width="180"
              >
              </el-table-column>
              <el-table-column
                prop="createTime"
                label="上传日期"
                align="center"
              >
              </el-table-column>
            </el-table>
          </devformVue>
        </div>
      </template>
      <template v-if="activeName == 2">
        <div class="type2-title margin-t0">案件基本信息</div>
        <div class="row">
          <devformVue label="案件编号 ">
            {{ formline.settleInfo.caseNo }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="收案日期 " classname="w2">
            {{ formline.settleInfo.receiptDate | changeTime }}
          </devformVue>
          <devformVue label="案件来源 " classname="w2">
            <dict-tag
              :options="dict.type.case_source2"
              :value="formline.caseSource"
            />
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="案件名称">
            {{ formline.settleInfo.caseName }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="案件类别">
            {{ formline.categoryName }}
            {{
              formline.subCategoryName ? ">>" + formline.subCategoryName : ""
            }}
            {{
              formline.thirdCategoryName
                ? ">>" + formline.thirdCategoryName
                : ""
            }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="案由">
            {{ formline.caseCause }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="客户">
            {{ formline.settleInfo.customerName }}
          </devformVue>
        </div>
        <!-- <div class="row">
          <devformVue label="委托人">
            {{ formline.settleInfo.agent }}
          </devformVue>
        </div> -->
        <div class="row">
          <devformVue label="代理程序"> {{ formline.agentProgram || '' }}</devformVue>
        </div>
        <div class="row">
          <devformVue label="案情简介"> {{ formline.summary }}</devformVue>
        </div>
        <div class="row">
          <devformVue label="案件备注"> {{ formline.note }}</devformVue>
        </div>
        <div class="type2-title">案件当事人</div>
        <div class="row">
          <devformVue label="申请人">
            <div
              v-for="(item, index) of formline.partiesInfo.clientParties"
              :key="item.caseId + index"
            >
              {{ filclientParties(item.type) }}
              <span
                >{{ item.agentName
                }}{{
                  index != formline.partiesInfo.clientParties.length - 1
                    ? " , "
                    : " "
                }}</span
              >
              <span>{{ formline.partiesInfo.mobile || "" }} </span>
              <span>{{ formline.partiesInfo.remark || "" }} </span>
            </div>
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="对方当事人">
            <div
              v-for="(item, index) of formline.partiesInfo.targetParties"
              :key="item.caseId + index"
            >
              <!-- <dict-tag
                class="dict-inlin"
                :options="dict.type.case_source"
                :value="item.caseId"
              /> -->
              {{ filclientParties(item.type) }}
              <span
                >{{ item.agentName }}
                {{
                  index != formline.partiesInfo.targetParties.length - 1
                    ? ", "
                    : " "
                }}</span
              >
            </div>
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="其他当事人">
            <div
              v-for="(item, index) of formline.partiesInfo.otherParties"
              :key="item.caseId + index"
            >
              {{ filclientParties(item.type) }}
              <span style="margin-right: 10px"
                >{{ item.agentName
                }}{{
                  index != formline.partiesInfo.otherParties.length - 1
                    ? ","
                    : ""
                }}</span
              >
            </div>
          </devformVue>
        </div>
        <div class="type2-title">案件费用信息</div>
        <div class="row">
          <devformVue label="标的额(元) " classname="w2">
            {{ formline.costInfo.subjectAmount }}
          </devformVue>
          <devformVue label="标的说明 " classname="w2">
            {{ formline.costInfo.subjectDescription }}
          </devformVue>
        </div>
        <!-- <div class="row">
          <devformVue label="标的额证明文件">
            <el-table
              :data="formline.costInfo.subjectAttachments"
              border
              class="primary-table"
            >
              <el-table-column prop="filename" label="文档" align="center">
                <template slot-scope="scope">
                  <el-button type="text" @click="ondownload(scope.row)">{{
                    scope.row.filename
                  }}</el-button>
                </template>
              </el-table-column>
              <el-table-column prop="remark" label="备注" align="center" />
              <el-table-column prop="size" label="大小" align="center" />
            </el-table>
          </devformVue>
        </div> -->
        <div class="row">
          <devformVue label="收费方式 " classname="w2">
            <dict-tag
              :options="dict.type.payment_type"
              :value="formline.costInfo.paymentType"
            />
          </devformVue>
          <devformVue label="差旅费(元) " classname="w2">
            {{ formline.costInfo.travelCosts }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="收费金额 " classname="w2">
            {{ formline.costInfo.fixedCosts }}
          </devformVue>
          <!-- <devformVue label="固定费用预计到款日期 " classname="w2">
            {{ formline.costInfo.estimatedReceiptDate }}
          </devformVue> -->
        </div>
        <div class="row">
          <devformVue label="收费备注">
            {{ formline.costInfo.costsRemark }}
          </devformVue>
        </div>
        <div class="type2-title">合同信息</div>
        <div class="row">
          <devformVue label="合同状态 " classname="w2">
            {{ contractStatusChange(formline.contractInfo.contractStatus) }}
          </devformVue>
          <devformVue label="合同提交时间 " classname="w2">
            {{ formline.contractInfo.contractSubmitTime }}
          </devformVue>
        </div>
        <div class="type2-title">案件人员信息</div>
        <div class="row">
          <devformVue label="案件负责人">
            {{ formline.handlerInfo.sourcePerson }}
          </devformVue>
        </div>
        <!-- <div class="row">
          <devformVue label="办案人员">
            <el-table
              :data="formline.handlerInfo.handlers"
              border
              class="primary-table"
            >
              <el-table-column prop="jobTitle" label="职务" align="center" />
              <el-table-column prop="name" label="人员" align="center" />
            </el-table>
          </devformVue>
        </div> -->
        <div class="row">
          <devformVue label="案件联系人">
            <el-table
              :data="formline.handlerInfo.linkmen"
              border
              class="primary-table"
            >
              <el-table-column prop="type" label="类型" align="center" />
              <el-table-column prop="name" label="联系人" align="center" />
              <el-table-column prop="mobile" label="联系电话" align="center" />
              <el-table-column prop="email" label="邮箱" align="center" />
              <el-table-column prop="remark" label="备注" align="center" />
            </el-table>
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="案件进展"> {{ formline.caseStage }}</devformVue>
        </div>
        <div class="row">
          <devformVue label="填单人 " classname="w2">
            {{ formline.handlerInfo.filler }}
          </devformVue>
          <devformVue label="填单时间 " classname="w2">
            {{ formline.handlerInfo.fillTime }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="所属分所 "
            >{{ formline.belongOrgName }}
          </devformVue>
        </div>
        <!-- <div class="view">
          <el-button type="text" @click="ondetail">查看修改记录</el-button>
        </div> -->
      </template>
      <template v-if="activeName == 3">
        <el-table
          :data="formline.attachments"
          style="width: 100%"
          border
          class="primary-table"
        >
          <el-table-column prop="filename" label="文档名称" align="center" />
          <el-table-column prop="createBy" label="创建人" align="center" />
          <el-table-column prop="createTime" label="创建时间" align="center" />
          <el-table-column prop="name" label="操作" align="center">
            <template slot-scope="scope">
              <el-button @click="ondownload(scope.row)">下载</el-button>
            </template>
          </el-table-column>
        </el-table>
      </template>
      <template v-if="activeName == 4">
        <div class="type2-title margin-t0">案件财务合计</div>
        <template v-if="true">
          <div class="row">
            <devformVue label="收费方式" classname="w3">
              <dict-tag
                :options="dict.type.payment_type"
                :value="formline.costInfo.paymentType"
              />
            </devformVue>
            <devformVue label="合同金额 " classname="w3">
              {{ formline.financialInfo.contractAmount }}
            </devformVue>
            <devformVue label="未到款 " classname="w3">
              {{ formline.financialInfo.unRecAmount }}
            </devformVue>
          </div>
          <div class="row">
            <devformVue label="收款总金额" classname="w3">
              {{ formline.financialInfo.totalAmount }}
            </devformVue>
            <devformVue label="已开票金额 " classname="w3">
              {{ formline.financialInfo.invoicedAmount }}
            </devformVue>
            <devformVue label="未开票 " classname="w3">
              {{ formline.financialInfo.uninvoicedAmount }}
            </devformVue>
          </div>
          <div class="row">
            <devformVue label="已分配金额 ">
              <span class="text-red">
                {{ formline.financialInfo.invoicedAmount }}</span
              >
              (律师分配金额
              <span class="text-red">{{
                formline.financialInfo.lawyerAllocAmount
              }}</span>
              +其他分配金额：<span class="text-red">{{
                formline.financialInfo.otherAllocAmount || 0
              }}</span
              >）
            </devformVue>
          </div>
          <div class="row">
            <devformVue label="公摊成本 " classname="w2">
              {{ formline.financialInfo.sharedAllocAmount }}
            </devformVue>
            <devformVue label="剩余金额 " classname="w2">
              {{ formline.financialInfo.balance }}
            </devformVue>
          </div>
        </template>
        <div class="type2-title">开票信息</div>
        <template v-if="formline.invoiceInfo">
          <div class="row">
            <devformVue label="纳税识别号" classname="w3">
              {{ formline.invoiceInfo.taxId }}
            </devformVue>
            <devformVue label="企业名称" classname="w3">
              {{ formline.invoiceInfo.taxCompany }}
            </devformVue>
            <devformVue label="企业地址" classname="w3">
              {{ formline.invoiceInfo.taxAddress }}
            </devformVue>
          </div>
          <div class="row">
            <devformVue label="联系电话" classname="w3">
              {{ formline.invoiceInfo.taxTel }}
            </devformVue>
            <devformVue label="开户行" classname="w3">
              {{ formline.invoiceInfo.bankName }}
            </devformVue>
            <devformVue label="开户行账号" classname="w3">
              {{ formline.invoiceInfo.bankAccount }}
            </devformVue>
          </div>
        </template>
        <div class="dev-form-nodata" v-else>无开票信息</div>
        <div class="type2-title">收款信息</div>
        <div class="row">
          <devformVue label="收款总额" classname="w3">
            {{ formline.financialInfo.totalAmount }}
          </devformVue>
          <devformVue label="已分配金额" classname="w3">
            {{ formline.financialInfo.invoicedAmount }}
          </devformVue>
          <devformVue label="未开票金额" classname="w3">
            {{ formline.financialInfo.uninvoicedAmount }}
          </devformVue>
        </div>
        <div class="type2-title">分配信息</div>
        <div class="row">
          <devformVue label="收款总额" classname="w3">
            {{ formline.financialInfo.totalAmount }}
          </devformVue>
          <devformVue label="已分配金额" classname="w3">
            {{ formline.financialInfo.invoicedAmount }}
          </devformVue>
          <devformVue label="已分配比例" classname="w3">
            {{
              formline.financialInfo.allocPercent
                ? formline.financialInfo.allocPercent + "%"
                : ""
            }}
          </devformVue>
        </div>
        <!-- <div class="dev-form-nodata">无分配信息</div> -->
        <div class="type2-title">律师分配</div>
        <template
          v-if="
            formline.financialInfo.lawyers &&
            formline.financialInfo.lawyers.length > 0
          "
        >
          <div
            class="row"
            v-for="(item, index) in formline.financialInfo.lawyers"
            :key="index + 'others'"
          >
            <devformVue label="律师人员" classname="w3">
              {{ item.userName }}
            </devformVue>
            <devformVue label="分配比例" classname="w3">
              {{ item.percentage }}
            </devformVue>
            <devformVue label="分配金额" classname="w3">
              {{ item.amount }}
            </devformVue>
          </div>
        </template>
        <div class="dev-form-nodata" v-else>无律师分配</div>
        <div class="type2-title">其他费用分配</div>
        <template
          v-if="
            formline.financialInfo.others &&
            formline.financialInfo.others.length > 0
          "
        >
          <div
            class="row"
            v-for="(item, index) in formline.financialInfo.others"
            :key="index + 'others'"
          >
            <devformVue label="费用说明" classname="w3">
              {{ item.description }}
            </devformVue>
            <devformVue label="分配比例" classname="w3">
              {{ item.percentage }}
            </devformVue>
            <devformVue label="分配金额" classname="w3">
              {{ item.amount }}
            </devformVue>
          </div>
        </template>
        <div class="dev-form-nodata" v-else>无其他费用分配</div>
        <div class="type2-title">公摊成本信息</div>
        <template
          v-if="
            formline.financialInfo.shared &&
            formline.financialInfo.shared.length > 0
          "
        >
          <div
            class="row"
            v-for="(item, index) in formline.financialInfo.shared"
            :key="index + 'shared'"
          >
            <devformVue label="公摊成本说明" classname="w5">
              {{ item.description }}
            </devformVue>
            <devformVue label="分配金额" classname="w5">
              {{ item.amount }}
            </devformVue>
          </div>
        </template>
        <div class="dev-form-nodata" v-else>无公摊成本信息</div>
      </template>
      <template v-if="activeName == 5">
        <div style="margin-left: 20px">
          流程：
          <el-select v-model="value" placeholder="请选择">
            <el-option
              v-for="item in [{ value: 'qw', label: 1 }]"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div>
        <div class="type2-title">流程信息</div>
        <div class="row">
          <devformVue label="流程名称"> 自动编号</devformVue>
          <devformVue label="发起人 "> 自动编号</devformVue>
        </div>
        <div class="row">
          <devformVue label="流程标题 "> 自动编号</devformVue>
        </div>
        <div class="row">
          <devformVue label="创建时间 "> 自动编号</devformVue>
          <devformVue label="结束时间 "> 自动编号</devformVue>
        </div>
        <div class="row">
          <devformVue label="流程图"> 点击查看</devformVue>
        </div>
        <div class="type2-title">流程任务信息</div>

        <div class="row">
          <el-table
            :data="formline.attachments"
            style="width: 100%"
            border
            class="primary-table"
          >
            <el-table-column
              prop="date"
              label="序号"
              align="center"
              width="60"
            />
            <el-table-column prop="name" label="任务名称" align="center" />
            <el-table-column prop="address" label="办理人" align="center" />
            <el-table-column prop="address" label="开始时间" align="center" />
            <el-table-column prop="address" label="结束时间" align="center" />
            <el-table-column prop="address" label="流向" align="center" />
            <el-table-column prop="address" label="意见" align="center" />
          </el-table>
        </div>
      </template>

      <template v-if="activeName == 6">
        <el-table
          :data="formline.stampApplications"
          style="width: 100%"
          border
          class="primary-table"
        >
          <el-table-column prop="applyBy" label="申请人" align="center" />
          <el-table-column prop="reason" label="申请原因" align="center" />
          <el-table-column prop="tel" label="联系电话" align="center" />
          <el-table-column prop="createTime" label="申请时间" align="center" />
          <el-table-column label="审批状态" prop="auditStatus">
            <template slot-scope="scope">
              <dict-tag
                :options="dict.type.audit_status"
                :value="scope.row.auditStatus"
              />
            </template>
          </el-table-column>
        </el-table>
      </template>
      <template v-if="activeName == 7">
        <div class="type2-title margin-t0">开票信息</div>
        <div class="row">
          <devformVue label="纳税识别号">
            {{ formline.invoiceInfo.taxId }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="企业名称" classname="w2">
            {{ formline.invoiceInfo.taxCompany }}
          </devformVue>
          <devformVue label="企业地址" classname="w2">
            {{ formline.invoiceInfo.taxAddress }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="联系电话">
            {{ formline.invoiceInfo.taxTel }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="开户行" classname="w2">
            {{ formline.invoiceInfo.bankName }}
          </devformVue>
          <devformVue label="开户行账号" classname="w2">
            {{ formline.invoiceInfo.bankAccount }}
          </devformVue>
        </div>
      </template>
      <template v-if="activeName == 8">
        <el-table :data="formline.reviewerList" stripe style="width: 100%">
          <el-table-column prop="userName" label="审批人员" align="center">
          </el-table-column>
          <el-table-column prop="status" label="审核状态">
            <template slot-scope="scope">
              <dict-tag
                :options="dict.type.audit_status"
                :value="scope.row.auditType"
              />
            </template>
          </el-table-column>
          <el-table-column prop="remark" label="审核意见"></el-table-column>
          <el-table-column prop="auditTime" label="审核时间">
            <template slot-scope="scope">
              {{ scope.row.auditTime | changeTime }}
            </template>
          </el-table-column>
        </el-table>
      </template>
      <template v-if="activeName == 9">
        <div class="row">
          <devformVue label="退案原因 " classname="w2">
            {{ formline.revokeReason }}
          </devformVue>
          <devformVue label="退案日期 " classname="w2">
            {{ formline.revokeDate }}
          </devformVue>
        </div>
        <div class="row">
          <devformVue label="附件 ">
            <!-- {{ formline.revokeAttachments }} -->
              <div>
                <div
                  v-for="(item, index) of formline.revokeAttachments"
                  :key="index + 'attach'"
                  >
                  {{ item.filename }}
                  <el-button type="text" @click="ondownload(item)">下载</el-button>
                </div>
              </div>
          </devformVue>
        </div>
        <el-table
          :data="formline.revokeReviewerList"
          stripe
          style="width: 100%"
        >
          <el-table-column prop="userName" label="审批人员" align="center">
          </el-table-column>
          <el-table-column prop="status" label="审核状态">
            <template slot-scope="scope">
              <dict-tag
                :options="dict.type.audit_status"
                :value="scope.row.auditType"
              />
            </template>
          </el-table-column>
          <el-table-column prop="remark" label="审核意见"></el-table-column>
          <el-table-column prop="auditTime" label="审核时间">
            <template slot-scope="scope">
              {{ scope.row.auditTime | changeTime }}
            </template>
          </el-table-column>
        </el-table>
      </template>
      <!-- <div class="row check" style="margin-top: 20px" v-if="editType != 1">
        <div class="col">
          <div class="label"><span class="red-icon">*</span>审核意见:</div>
          <div class="value">
            <span>{{ formline.remark }}</span>
          </div>
        </div>
      </div> -->
    </div>
    <div class="foot" slot="footer">
      <el-divider />
      <el-button @click="submitForm" type="primary" v-if="editType != 2"
        >确定
      </el-button>
      <template v-else>
        <el-form>
          <el-form-item label="审批意见" required>
            <div
              style="
                display: flex;
                align-items: flex-start;
                gap: 10px;
                flex-direction: column;
                justify-content: flex-start;
              "
            >
              <el-radio-group v-model="dataForm.auditStatus">
                <el-radio label="1">同意</el-radio>
                <el-radio label="2">不同意</el-radio>
              </el-radio-group>

              <el-input
                type="textarea"
                rows="3"
                placeholder="审批意见"
                v-model="dataForm.remark"
              />
            </div>
          </el-form-item>
        </el-form>
        <!-- : -->
        <el-button
          @click="onSubmit"
          :disabled="!dataForm.auditStatus"
          type="primary"
          >确定
        </el-button>
        <!-- <el-button
          type="danger"
          :disabled="dataForm.remark === '不同意'"
          v-loading="loading"
          @click="onSubmit(2)"
          >拒绝</el-button
        >
        <el-button
          type="primary"
          v-loading="loading"
          :disabled="dataForm.remark === '同意'"
          @click="onSubmit(1)"
          >通过</el-button
        > -->
      </template>
    </div>
    <!-- </div> -->
    <updateModal ref="updateModal" />
  </el-dialog>
</template>

<script>
import updateModal from "./updateModal.vue";
import devformVue from "./devform.vue";
import { casedetail, audit, download, revokeAudit } from "@/api/case/case";
// import DictData from ''
import moment from "moment";
import { number } from "echarts";

export default {
  components: { devformVue, updateModal },
  dicts: [
    "case_state",
    "payment_type",
    "case_source",
    "case_source2",
    "payment_type",
    "proxy_procedure",
    "audit_status",
    "sys_accept_org_name",
    "resolve_type",
    "sys_carage_type",
    "sys_carage_type_1",
    "sys_carage_type_2",
    "sys_carage_type_3",
    "sys_carage_type_4",
    "sys_carage_type_6",
    "sys_carage_type_9",
    "sys_carage_type_10",
    "sys_carage_type_10_hasson_1",
    "sys_carage_type_6_1_hasson",
    "sys_carage_type_11",
    "sys_carage_type_6_2",
    "sys_carage_type_6_4",
    "sys_carage_type_10_2",
    "case_source_attack",
    "case_source_defend",
    "case_source_other",
    "sys_proxy_procedure_1",
    "proxy_agent_permission",
    "proxy_agent_permission_1",
    "sys_carage_type_1_2", // 民事诉讼-债权
    "sys_carage_type_1_3", // 民事诉讼-知识产权纠纷
    "sys_carage_type_1_4", // 民事诉讼-婚姻家庭纠纷
    "sys_carage_type_1_5", // 民事诉讼-商事纠纷
  ],
  data() {
    return {
      dialog: {
        visible: false,
      },
      activeName: "1",
      targetPartiesshow: "",
      clientParties: "", // 委托人
      proxyProcedureshow: [],
      tabArr: [],
      arr: [{ id: 43 }, { id: 23 }],
      formline: {
        text: "",
        arr1: [],
        arr2: [],
        attachments: [],
        stampApplications: [],
        suitInfo: {
          acceptOrgId: null,
          acceptOrgNo: null,
          adjudicator: null,
          courtSessionTime: null,
          detainLocation: null,
          proxyAgentPermissions: null,
          proxyProcedure: null,
        },
        title: "",
      },
      ruleform: {},
      title: "案件详情",
      options2: [
        { value: 1, label: "企业法人" },
        { value: 2, label: "自然人客户类型" },
      ], //type2科技；类型
      step: 2, //当前步骤
      typeGvalue: 2, //客户类型组选项
      type: "",
      typegrounp: [
        //客户类型组数组
        { value: 1, label: "单位组织客户类型" },
        { value: 2, label: "自然人客户类型" },
      ],
      editType: "",
      dataForm: {
        auditStatus: "1",
        id: 0,
        remark: "",
      },
      loading: false,
    };
  },

  computed: {
    proxyProcedurearry() {
      console.log(this.formline.categoryId, "------------------");
      if (this.formline.categoryId == "sys_carage_type_2") {
        return "proxy_procedure";
      } else if (
        [
          "sys_carage_type_1",

          "sys_carage_type_3",
          "sys_carage_type_5",
          "sys_carage_type_10",
        ].includes(this.formline.categoryId)
      ) {
        return "sys_proxy_procedure_1";
      } else {
        return [];
      }
    },
  },
  filters: {
    changeTime(tiem) {
      if (!tiem) return "";
      return moment(tiem).format("YYYY-MM-DD HH:mm:ss");
    },
  },
  props: {
    proveType: [String, Number],
  },
  methods: {
    getTimer(timer) {
      return;
    },
    filclientParties(val) {
      let value = [];
      console.log(val, "=======");
      this.dict.type.case_source.map((item) => {
        this.dict.type[item.value].map((a) => {
          if (a.value == val) {
            value.push(a);
          }
        });
      });
      console.log(value);
      return value[0]?.label;
    },
    proxyAgentPermissionsarray() {
      //为任意代理权限
      if (this.param.categoryId == "sys_carage_type_2") {
        return "proxy_agent_permission";
      } else if (
        [
          "sys_carage_type_1",
          "sys_carage_type_3",
          "sys_carage_type_5",
          "sys_carage_type_9",
          "sys_carage_type_10",
        ].includes(this.param.categoryId)
      ) {
        return "proxy_agent_permission_1";
      } else {
        return null;
      }
    },
    getTabArr(type) {
      let arr = [
        { label: "结案信息", vlaue: "1" },
        { label: "案件基本信息", vlaue: "2" },
        { label: "案件文档", vlaue: "3" },
        { label: "财务信息", vlaue: "4" },
        // { label: "审批信息", vlaue: "5" },
        { label: "用章记录", vlaue: "6" },
        { label: "开票信息", vlaue: "7" },
        { label: "审批状态", vlaue: "8" },

      ];
      if (type == 2) {
        this.activeName = "2";
        let newArr = [arr[1]];
        return newArr;
      }
      return arr;
    },
    //合同状态变换
    contractStatusChange(val) {
      switch (val) {
        case 0:
          return "未提交";
        case 1:
          return "已提交";
        default:
          return val;
      }
    },
    //文档下载
    ondownload(row) {
      console.log(row);
      // download({ fileName: row.filename, url: row.url });
      let resource = `${row.url}`;
      this.$download.resource(resource);
    },
    //打开弹窗
    async open(row, type = 1) {
      console.log("opening", row);
      if (row.caseName) {
        this.title = ` ${row.caseName || ""}-案件类型`;
      }

      this.tabArr = this.getTabArr(type);
      if (this.proveType == 3 || [4, 5].includes(row.status)) {
        this.tabArr.push({ label: "退案详情", vlaue: "9" })
      }
      this.dataForm.id = row.id;
      this.dataForm.remark = "";
      this.editType = type;

      this.getDetail(row.id);
    },
    getDetail(id) {
      // 1查看，2审核，3审核后的查看
      //编辑获取详情
      console.log("this.id", id);
      this.formline.categoryId = "unit";

      casedetail(id).then((res) => {
        console.log(res.data);
        // Object.assign(this.ruleform, res.data);
        this.formline = Object.assign(this.formline, res.data);
        console.log(this.formline);
        this.targetPartiesshow = (res.data.partiesInfo.targetParties || [])
          .map((item) => item.agentName)
          .join(",");
        this.clientParties = res.data.partiesInfo?.clientParties
          ?.map((item) => item.agentName)
          .join(",");

        this.proxyProcedureshow = res.data.suitInfo.proxyProcedure
          ? res.data.suitInfo.proxyProcedure.split(",")
          : "";
        console.log("=====", this.proxyProcedureshow);
        this.title = ` ${res.data.caseName || ""}-案件类型`;
        this.formline.revokeDate = moment(this.formline.revokeDate).format(
          "YYYY-MM-DD"
        );
        this.$nextTick(() => {
          this.dialog.visible = true;
        });
      });
    },
    onSaveBack() {
      let { id, remark } = this.dataForm;
      revokeAudit({
        id,
        remark,
      });
    },
    onSubmit() {
      // let status = this.dataForm.remark === '同意' ? '1' : '2'
      this.loading = true;
      let req =
        this.proveType != 3 ? audit(this.dataForm) : revokeAudit(this.dataForm);

      req
        .then((res) => {
          this.$message.success("保存成功");
          this.$parent.getList();
          this.loading = false;
          this.dialog.visible = false;
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    //查看修改记录
    ondetail(val) {
      this.$refs.updateModal.open();
    },
    submitForm(formName) {
      if (this.type == 3) {
        return;
      }
      this.$emit("submit");
      this.loading = false;
      this.dialog.visible = false;
    },
    handleClick(tab, event) {
      console.log(tab, event);
    },
  },
};
</script>

<style lang="scss" scoped>
$--color-titlebg: #f6f9fd; /* 表格标题背景颜色 */
$--color-border: #e9eef5; /* 边框颜色 */
$--color-labelbg: #f6f9fe; /* label北京颜色 */
.red-icon {
  color: red;
}

.detail-dialog {
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  .type2-title {
    margin-top: 20px;
  }

  .view {
    text-align: center;
  }

  .type2 {
    height: calc(100% - 56px);
    overflow-y: auto;
    overflow-x: hidden;
  }

  .margin-t0 {
    margin-top: 0px;
  }

  // .row {
  //   width: calc(100% - 3px);
  // }
  // .type2-title {
  //   width: calc(100% - 3px);
  // }
}

.text-red {
  color: red;
}

.foot {
  text-align: right;
  margin-top: 20px;
  margin-right: 30px;
}

.dict-inlin {
  display: inline-block;
  margin-right: 10px;
}

::v-deep .primary-table.el-table .el-table__header-wrapper th {
  background: #eaf3ff;
  height: 30px;
}

::v-deep .primary-table .el-table--medium .el-table__cell {
  padding: 5px -px;
}

::v-deep .type2 .el-input--medium .el-input__inner {
  height: 30px;
  line-height: 30px;
}

::v-deep .type2 .el-input--medium .el-input__icon {
  line-height: 30px;
}

::v-deep .type2 .w190.el-input.el-input--medium {
  width: 190px;
}

::v-deep .type2 .el-input.el-input--medium {
  width: 200px;
}

::v-deep .check .el-input.el-input--medium {
  width: 100%;
}

::v-deep .el-dialog__body {
  padding: 0px;
  height: calc(100vh - 253px);
  overflow-y: auto;
  overflow-x: hidden;
  padding-bottom: 0px;
}

.audit ::v-deep .el-dialog__body {
  height: calc(100vh - 353px);
}

::v-deep .el-tabs__nav.is-top {
  margin-left: 20px;
}

::v-deep .value {
  flex-wrap: wrap;
}

::v-deep .label {
  width: 170px;
}

::v-deep .el-dialog__footer {
  padding-top: 0px;
}
</style>
